<template>
  <SuperTable :data-request="fetchData" :columns="baseColumns" header-title="审批管理" pager align="center" border ref="supertable" :export-config="{}"> </SuperTable>
  <a-drawer :footerStyle="{ display: 'flex', justifyContent: 'center' }" title="编辑配置" width="25%" :visible="visibleloading" @close="onClose">
    <a-form :model="formState" name="basic" :label-col="{ span: 6 }" :wrapper-col="{ span: 16 }" autocomplete="off">
      <a-form-item name="area" label="审批配置">
        <a-select v-model:value="formState.area" allowClear :options="areas" />
      </a-form-item>
      <a-form-item name="area" label="双人双锁配置">
        <a-select v-model:value="formState.doubleConfigId" allowClear :options="areas" />
      </a-form-item>
    </a-form>
    <template #footer>
      <a-button style="margin-right: 15px" @click="onClose">取消</a-button>
      <a-button type="primary" @click="submit">保存</a-button>
    </template>
  </a-drawer>
</template>

<script setup lang="tsx">
import { ref, reactive } from 'vue';
import SuperTable from '@/framework/components/core/super-table/super-table.vue';
import { VxeGridPropTypes } from 'vxe-table';
import columns, { TableColumnList } from './columns';
import { getSeeList, getPutList } from '../../api/approval_configuration';
import { getList } from '../../api/approval_management';
const fetchData = async (ori: VxeGridPropTypes.ProxyAjaxQueryParams) => {
  let queryOpt = {
    pageSize: ori.page.pageSize,
    pageNum: ori.page.currentPage,
    'orderBy[0].field': 'createTime', // 默认排序字段
    'orderBy[0].order': 'desc', // 默认排序方式
  };

  const { result } = await getSeeList(queryOpt);
  return result;
};
const supertable = ref();
const areas = [];
const meijue = async () => {
  let queryparams: any = {
    pageSize: 1000,
    pageNum: 1,
    orderBy: [
      {
        field: 'createTime',
        order: 'desc',
      },
    ],
    paging: false,
  };
  let { result } = await getList(queryparams);
  console.log(result);
  result.data.forEach((item) => {
    areas.push({ label: item.flowPathName, value: item.id });
  });
  areas.push({ label: '无', value: 0 });
};
meijue();
let baseColumns: TableColumnList = [
  ...columns,
  {
    title: '操作',
    field: '$action',
    hideInSearch: true,
    align: 'center',
    fixed: 'right',
    width: 300,
    actions: ({ row }) => [
      {
        label: '编辑',
        onClick: async () => {
          console.log(row, 66);
          formState.doubleConfigId = row.doubleConfigId;
          formState.id = row.id;
          visibleloading.value = true;
        },
      },
    ],
  },
];
const visibleloading = ref(false);
const formState: any = reactive({
  area: '',
  doubleConfigId: '',
  id: null,
});

const onClose = () => {
  visibleloading.value = false;
  formState.area = null;
  formState.doubleConfigId = null;
  formState.id = null;
};
const submit = async () => {
  await getPutList(formState.id, { doubleConfigId: formState.doubleConfigId });
  supertable.value?.refreshTable();
  onClose();
};
</script>
<style lang="less" scoped></style>
